<template>
	<view class="content">
		<navtive title="咪鸽"></navtive>
		<bg ref="bgRef" ></bg>
		<btns :text="tipText" :icon="appLogo" class="bg-ref" v-if="mobile" @click="down"></btns>
		<view v-else class="bg-ref">
			<btns text="安卓下载" :icon="Iocn.Android" class="btn"  @click="downAndroid"></btns>
			<btns text="苹果下载" :icon="Iocn.iPhone" class="btn"  @click="downIos(1)"></btns>
		</view>
		<!-- <tabbar ></tabbar> -->
	</view>
</template>

<script setup>
	import {ref} from 'vue'
	import { onLoad,onShow } from '@dcloudio/uni-app'
	import navtive from '@/components/navtive/navtive.vue'
	import bg from '@/components/bg/bg.vue'
	import btns from '@/components/btns/bottomBtn.vue'
	import tabbar from '@/components/tabber/tabber.vue'
	import {getSystem,inWeCaht,downloadFile} from '@/utils/index.js'
	import {SysEnums,Iocn,deviceTypeEnums} from '@/enums/SysEnums.js'
	import {getDownUrl} from '@/api/app.js'
	
	const deviceTyle = ref(0)
	const tipText = ref('')
	const appLogo = ref('')
	// 默认手机中打开
	const mobile = ref(true)
	onShow(()=>{
		uni.hideTabBar()
	})
	onLoad(()=>{
		let system = getSystem()
		console.log(system)
		// 如果不在手机中打开
		if(!system){
			mobile.value = false
			return
		}
		if(system.equipment === SysEnums.Android){
			tipText.value = '安卓下载'
			appLogo.value = Iocn.Android
			deviceTyle.value = deviceTypeEnums.Android
		}
		else if(system.equipment === SysEnums.iPhone){
			tipText.value = '苹果下载'
			appLogo.value = Iocn.iPhone
			deviceTyle.value = deviceTypeEnums.iPhone
		}
		else{
			tipText.value = '无法识别'
		}
	})
	
	const down = ()=>{
		// 如果在微信中打开 提示跳出微信
		let flag = inWeCaht()
		if(flag){
			return uni.showToast({
				title: '可在浏览器中打开下载此文件',
				icon:'none',
				duration: 4000
			});
		}
		
		if(deviceTyle.value === deviceTypeEnums.iPhone){
			downIos(deviceTypeEnums.iPhone)
			return
		}
		downAndroid()
	}
	
	const downAndroid = ()=>{
		getDownUrl(deviceTyle.value).then(res=>{
			if(res.downloadUrl){
			  let url = res.downloadUrl
			  downloadFile(url)
			}
		})
	}
	
	const downIos = (deviceTyle)=>{
		getDownUrl(deviceTyle).then(res=>{
			window.open(res.downloadUrl,'_blank')
		})
		
	}
	
</script>

<style scoped lang="scss">
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		position: relative;
		.bg-ref{
			position: fixed;
			bottom: 20%;
			z-index: 10;
			.btn{
				margin: 10px 0;
			}
		}
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

</style>
